<template>
  <div class="sortPage" v-if="banners.length>0">
    <menu-search></menu-search>
    <sort-all class="sort-menu"></sort-all>
    <top-icon></top-icon>
  </div>
</template>

<script type="text/ecmascript-6">
import SortAll from "../../components/SortAll";
import topIcon from "../../components/topIcon";
import { getindexAlldata } from "../../api/index";
import menuSearch from "../../components/menuSearch/index";
export default {
  name: "",
  components: {
    SortAll,
    topIcon,
    menuSearch
  },
  computed: {
    banners() {
      return this.$store.state.indexData.banner || [];
    }
  },
  watch: {
    banners(news, old) {
      this.$toast.clear();
    }
  },
  methods: {
    getAlldata() {
      var data = this.$store.state.indexData;
      var arr = Object.keys(data);

      this.$toast.loading({
        message: "加载中..."
      });

      if (arr.length <= 0) {
        getindexAlldata();
      } else {
        this.$toast.clear();
      }
    }
  },
  created() {
    this.getAlldata();
  }
};
</script>

<style scoped lang="less">
.van-sticky {
  background: #ffffff;
}

.sort-menu-tab {
  position: relative;
  background: #ffffff;
  height: 0.88rem;
  .sort-menu-tabUl {
    width: 6.6rem;
    height: 100%;
    display: flex;
    .sort-menu-tabli {
      width: 25%;
      display: flex;
      justify-content: center;
      align-items: center;
      color: rgba(39, 41, 55, 1);
      position: relative;
      &.active {
        font-size: 0.32rem;
        font-weight: 500;
        color: rgba(228, 152, 41, 1);
        &:after {
          content: "";
          display: block;
          width: 0.48rem;
          height: 0.08rem;
          background: rgba(228, 157, 53, 1);
          border-radius: 0.05rem;
          position: absolute;
          left: 50%;
          margin-left: -0.24rem;
          bottom: -0.03rem;
        }
      }
    }
  }
  .sort-menu-select {
    width: 0.44rem;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0.3rem;
    text-align: center;
    font-size: 20px;
    display: flex;
    align-items: center;
  }
}
.sort-menu {
  position: relative;
  .van-tabs__wrap {
    display: none;
  }
}
</style>
